import 'dart:typed_data';
import 'dart:ui' as dartUI;
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:throttling/throttling.dart';
import 'package:work_tools/values/color.dart';
import 'package:work_tools/values/font.dart';
import 'package:work_tools/values/text_style.dart';
import 'package:work_tools/widget/button.dart';
import 'package:work_tools/widget/sheets/login_sheet/login_sheet_logic.dart';

class LoginSheetWidget extends StatelessWidget {

  final logic = Get.put(LoginSheetLogic());
  final state = Get.find<LoginSheetLogic>().state;

  final _posterGlobalKey = GlobalKey();
  final String user;
  final String carModelName;
  final String carDesc1;
  final String carDesc2;
  final String carImgPath;
  final String? slognPath;
  final String wechatMiniPath;

  LoginSheetWidget({
    Key? key,
    required this.user,
    required this.carModelName,
    required this.carDesc1,
    required this.carDesc2,
    required this.carImgPath,
    required this.wechatMiniPath,
    this.slognPath,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      alignment: Alignment.center,
      child: Container(
        width: 600,
        height: 500,
        color: Colors.white,
        child: Column(
          children: [
            Container(
              margin: const EdgeInsets.only(top: 20),
              alignment: Alignment.center,
              child: Text("用户登录",style: TStyleUtil.sc_5_14(ColorsValue.black2a)),
            ),
            Padding(
              padding: const EdgeInsets.only(left: 20, right: 20, top: 40),
              child: loginField(context),
            ),
            const Spacer(),
            Row(
              children: [
                const SizedBox(width: 20),
                Expanded(
                  child: SizedBox(
                    height: 60,
                    child: cancelBtn(context),
                  ),
                ),
                const SizedBox(width: 20),
                Expanded(
                  child: SizedBox(
                    height: 60,
                    child: loginBtn(context),
                  ),
                ),
                const SizedBox(width: 20),
              ],
            ),
            const Spacer(),
          ],
        ),
      ),
    );
  }

  Widget loginField(BuildContext context) {
    return Column(
      children: [
        Container(
          padding: const EdgeInsets.only(bottom: 20),
          decoration: const BoxDecoration(
            border: Border(bottom: BorderSide(color: Color(0xFFDFDFDD), width: 1)),
          ),
          child: TextFormField(
            onChanged: (value) => state.mobile(value),
            initialValue: state.mobile(),
            keyboardType: TextInputType.number,
            inputFormatters: [FilteringTextInputFormatter.digitsOnly],
            style: TextStyle(fontSize: Font.font14),
            decoration: InputDecoration(
              contentPadding: EdgeInsets.zero,
              border: const OutlineInputBorder(borderSide: BorderSide.none),
              hintText: "请输入您的手机号码",
              counterText: "",
              hintStyle: TStyleUtil.sc_4_14(ColorsValue.textGrey),
            ),
            maxLength: 11,
          ),
        ),
        const SizedBox(height: 40),
        Container(
          padding: const EdgeInsets.only(bottom: 20),
          decoration: const BoxDecoration(
            border: Border(bottom: BorderSide(color: Color(0xFFDFDFDD), width: 1)),
          ),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Expanded(
                child: TextFormField(
                  focusNode: state.nodeSmsCodeField,
                  onChanged: (value) => state.code(value),
                  initialValue: state.code(),
                  keyboardType: TextInputType.number,
                  inputFormatters: [FilteringTextInputFormatter.digitsOnly],
                  style: TextStyle(fontSize: Font.font14),
                  decoration: InputDecoration(
                    contentPadding: EdgeInsets.zero,
                    border: const OutlineInputBorder(borderSide: BorderSide.none),
                    hintText: "请输入验证码",
                    counterText: "",
                    hintStyle: TStyleUtil.sc_4_14(ColorsValue.textGrey),
                  ),
                  maxLength: 4,
                ),
              ),
              Container(
                margin: const EdgeInsets.only(left: 94),
                width: 1,
                height: 26,
                color: const Color(0xFFDFDFDD),
              ),
              const SizedBox(width: 10),
              SizedBox(
                width: 200,
                child: !state.isSmsCode()
                    ? GestureDetector(
                        onTap: () async {
                          await logic.smsCode();
                          FocusScope.of(context).unfocus();
                        },
                        child: Text(
                          "发送验证码",
                          textAlign: TextAlign.center,
                          style: TextStyle(
                              color: ColorsValue.blue3, fontSize: Font.font14),
                        ),
                      )
                    : Text(
                        "重发 ${state.countdownTime}秒",
                        textAlign: TextAlign.center,
                        style: TStyleUtil.sc_4_14(ColorsValue.textGrey),
                      ),
              ),
            ],
          ),
        )
      ],
    );
  }
  final thr = Throttling(duration: const Duration(seconds: 5));

  Widget cancelBtn(BuildContext context) {
    return TextOutlinedButton(
      title: "取消",
      onTap: () {
        Get.back();
      },
    );
  }

  Widget loginBtn(BuildContext context) {
    return TextFullButton(
      height: 90.w,
      title: "登  录",
      onTap: () {
        thr.throttle(() {
          logic.login();
        });
      },
    );
  }

  static void displaySheet(
      BuildContext ctx, {
        required String user,
        required String carModelName,
        required String carImgPath,
        required String wechatMiniPath,
        required String carDesc1,
        required String carDesc2,
        String? slognPath,
      }) {
    showModalBottomSheet(
      backgroundColor: Colors.transparent,
      isScrollControlled: true,
      context: ctx,
      builder: (BuildContext context) {
        return LoginSheetWidget(
          user: user,
          carModelName: carModelName,
          carDesc1: carDesc1,
          carDesc2: carDesc2,
          carImgPath: carImgPath,
          wechatMiniPath: wechatMiniPath,
          slognPath: slognPath,
        );
      },
    );
  }
}
